<script setup lang="ts">
import { PropType, reactive } from 'vue'
import type { AdverData } from '@/api/lunbotu/types'
import { Descriptions } from '@/components/Descriptions'
import { useI18n } from '@/hooks/web/useI18n'
import { ElTag } from 'element-plus'
import { DescriptionsSchema } from '@/types/descriptions'

const { t } = useI18n()

defineProps({
  currentRow: {
    type: Object as PropType<Nullable<AdverData>>,
    default: () => null
  }
})

const schema = reactive<DescriptionsSchema[]>([
  {
    field: 'img_address',
    label: '图片地址'
  },
  {
    field: 'true_name',
    label: '真实姓名'
  },
  {
    field: 'img_title',
    label: '图片标题'
  },
  {
    field: 'img_type',
    label: '图片类型'
  },
  {
    field: 'update_date',
    label: '更新时间',
    span: 24
  },
  {
    field: 'display',
    label: '是否上线',
    span: 24
  },
  {
    field: 'remarks',
    label: '备注',
    span: 24
  }
])
</script>

<template>
  <Descriptions :schema="schema" :data="currentRow || {}">
    <template #imgAddress="{ row }: { row: AdverData }">
      <img :src="row.imgAddress" width="200" height="200" />
    </template>
  </Descriptions>
</template>
